﻿<%@ Page Title="" Language="C#" MasterPageFile="~/PBOfficeMaster.master" AutoEventWireup="true"
    CodeFile="Index.aspx.cs" Inherits="Admin_Index" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <style type="text/css">
        .return
        {
            margin: 10px auto;
            width: 50px;
            height: 23px;
            background-color: #ccffff;
            border: 1px solid #000099;
            color: #000099;
           
        }
        #Cards
        {
            position: relative;
        }
        #Cards .card
        {
            position: relative;
            width: 150px;
            height: 120px;
            margin:5px ;        
            float: left;
            background-image: url(images/cardbg.png);
        }
        #Cards .handle
        {
            width:150px;
            height: 23px;
            float:left;
            line-height: 23px;
            background-image: url(../imges/indexfram.jpg);
            font-weight: bold;
            text-indent: 0.2em;
           
        }
        #Cards .handle .title
        {
            float:left;
            width:100px;
        }
        #Cards .handle .del
        {
            float: right;
            cursor: pointer;
        }
        #Cards .handle .del img
        {
            padding: 5px;
            width: 15px;
            height: 15px;
        }
        #Cards .cardContent{ padding:0px;}

    </style>
    <script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../js/jquery-ui-1.10.2.custom.min.js"></script>
   
   <%-- <script type="text/javascript">
        function xmlCreate() {
            if (window.ActiveXObject) {
                return new ActiveXObject("Microsoft.XMLHTTP");
            }
            else { return new XMLHttpRequest(); }
        }
        window.onload = function returnDesk() {
            var xmlRequest = xmlCreate();
            xmlRequest.onreadystatechange = function () {
                if (xmlRequest.readystate == 4 && xmlRequest.status == 200) {

                    var desk = eval("(" + xmlRequest.responseText + ")");
                    document.getElementById("showDesk").innerHTML = "";
                    for (var i = 0; i < desk.length; i++) {
                        var htmlStr = "<div id=div" + desk[i].FunId.toString() + " style=' margin: 2px 2px; float:left; width:154px; height:104px; padding:0;'>";
                        htmlStr += "<iframe style=' width: 150px; height: 100px;' frameborder='0' scrolling='no' ";
                        if (desk[i].FunId == 101) {
                            htmlStr += "src='../ScheduleManager/IndexSchedule.aspx'></iframe></div>";
                        }
                        if (desk[i].FunId == 102) {
                            htmlStr += "src='../NewsManager/IndexNews.aspx'></iframe></div>";
                        }
                        if (desk[i].FunId == 103) {
                            htmlStr += "src='../AppraisalManager/kaoqing.aspx'></iframe></div>";
                        }
                        if (desk[i].FunId == 104) {
                            htmlStr += "src='../Message/MessageIndex.aspx'></iframe></div>";
                        }
                        if (desk[i].FunId == 105) {
                            htmlStr += "src='../MeetingRoomManager/MeetingRoomIndex.aspx'></iframe></div>";
                        }
                        if (desk[i].FunId == 106) {
                            htmlStr += "src='../CommonInfoManager/AddressIndex.aspx'></iframe></div>";
                        }
                        document.getElementById("showDesk").innerHTML += htmlStr;
                    }
                    document.getElementById("showDesk").style.display = "";
                }


            }
            //3,初始化XMLrequest
            xmlRequest.open("POST", "Handler.ashx", true);
            xmlRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            //4、发送请求
            xmlRequest.send();
            //            var data = "username" + document.getElementById("").value;
            //            xmlRequest.send(data);

        }

        //        $(function () {
        //            $("#div101").draggable();
        //            $()
        //        });
        function make_draggable(elements) {
            elements.draggable({
                opacity: 0.8,
                containment: 'parent',
                start: function (e, ui) { ui.helper.css('z-index', ++zIndex); },
                stop: function (e, ui) {
                    $.get('update_position.php', {
                        x: ui.position.left,
                        y: ui.position.top,
                        z: zIndex,
                        id: parseInt(ui.helper.find('span.data').html())
                    });
                }
            });
        }


    </script>--%>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <div style=" width:864px;">
        <asp:Button ID="btnReturn" runat="server" CssClass="return" Text="重置" OnClick="btnReturn_Click" />
    </div>
    <div id="Cards">
        <asp:ListView ID="lvDesktop" runat="server" OnItemDataBound="lvDesktop_ItemDataBound">
            <ItemTemplate>
                <asp:Panel ID="pCard" runat="server" CssClass="card" Style="left: 0px; top: 0px;">
                    <asp:Panel ID="pDragHandle" runat="server" CssClass="handle"  no='<%# Eval("FunId")  %>'>
                        <asp:Label ID="lTitle" runat="server" CssClass="title" Text='<%# Eval("Title") %>'></asp:Label><div
                            class="del" onclick="delCard(this.parentNode.parentNode);">
                            <img src="../imges/delete.png" onclick="delCard(this.parentNode.parentNode);" /></div>
                    </asp:Panel>
                    <asp:Panel ID="pContent" runat="server" CssClass="cardContent">
                    </asp:Panel>
                </asp:Panel>
            </ItemTemplate>
        </asp:ListView>
    </div>
     <script type="text/javascript">
         //事件添加
         $addHandler(window, "load", welcome, true);
         function welcome(e) {
             rebuildControls();

             $addHandler(ctrls, "mousedown", dragDown);
             $addHandler(ctrls, "mouseup", dragUp);
             //DesktopService.HelloWorld(function (r) { alert(r); });

         }

         //卡片换位
         var ctrls = [], //拖拽柄控件缓存数组
        nos = [], //拖拽柄控件编号数组
        sWidth = 864, //div总宽度,用来计算位置
        colWidth = 160, //列宽
        rowHeight = 130, //行高
        cols = sWidth / colWidth | 0, //卡片的列数
        rows, //卡片的行数
        exchaged = false; //卡片是否已交换 
         function getRowCol(index) {
             /// <summary>根据index返回所在行、列</summary>
             return [index / cols | 0, index % cols];
         }

         function changeDrag(targetIndex) {
             /// <summary>交换卡片</summary>
             var parentNode = dragT.parentNode;
             var tempNode = ctrls[targetIndex];
             ctrls[targetIndex] = ctrls[dragIndex];
             ctrls[dragIndex] = tempNode;

             for (var i in ctrls)
                 parentNode.appendChild(ctrls[i].parentNode);
             var oP = getLeftTop(dragIndex);
             var nP = getLeftTop(targetIndex);
             dragT.style.left = parseInt(dragT.style.left) + oP[0] - nP[0] + "px";
             dragT.style.top = parseInt(dragT.style.top) + oP[1] - nP[1] + "px";
             exchaged = true;
             dragIndex = targetIndex;
         }

         function getIndex(e) {
             /// <summary>获取当前鼠标指针所在索引号</summary>
             var x = e.offsetX;
             var y = e.offsetY;
             var p = getLeftTop(dragIndex);
             var nowLeftTop = [p[0] + parseInt(dragT.style.left) + x, p[1] + parseInt(dragT.style.top) + y];
             var nowCol = nowLeftTop[0] / colWidth | 0;
             var nowRow = nowLeftTop[1] / rowHeight | 0;
             if (nowRow < 0) nowRow = 0;
             if (nowRow > rows - 1) nowRow = rows - 1;
             if (nowCol < 0) nowCol = 0;
             if (nowCol > cols - 1) nowCol = cols - 1;
             var index = nowRow * cols + nowCol;
             return (index > ctrls.length - 1) ? (ctrls.length - 1) : index;
         }

         function getLeftTop(index) {
             /// <summary>根据index返回位置</summary>
             var rowCol = getRowCol(index);
             return [rowCol[1] * colWidth, rowCol[0] * rowHeight];
         }

         function rebuildControls() {
             /// <returns type="Array" />
             /// <summary>重建控件数组缓，并返回控件当前的id顺序数组</summary>
             ctrls = [];
             nos = [];
             var c = $get("Cards");
             for (var i = c.firstChild; i != null; i = i.nextSibling)
                 if (i.nodeType == 1)
                     for (var j = i.firstChild; j != null; j = j.nextSibling) {
                         if (j.nodeType == 1 && j.className == "handle") {
                             ctrls.push(j);
                             nos.push(j.attributes["no"].value);
                         }
                     }
             var l = ctrls.length;
             rows = Math.ceil(l / cols);
             return nos;
         }

         /* 对象拖拽功能的实现 */
         var oX, oY, dragT, dragIndex;

         function changeZIndex(t) {
             var max = 1;
             for (var i in ctrls) {
                 var index = ctrls[i].parentNode.style.zIndex;
                 if (index > max) max = index;
                 if (t == ctrls[i].parentNode)//获取拖拽控件的位置信息
                     dragIndex = i;
             }
             t.style.zIndex = max + 1;
         }

         function dragDown(e) {
             if (dragT) return;
             dragT = this.parentNode;
             setOpacity(dragT, 0.8);
             changeZIndex(dragT);
             if (!e) e = window.event;
             oX = e.screenX;
             oY = e.screenY;
             ctrls[dragIndex].style.cursor = "move";
             document.onmousemove = dragMove;
         }

         function dragMove(e) {
             if (!dragT) return;
             if (!e) e = window.event;
             dragT.style.left = parseInt(dragT.style.left) + (e.screenX - oX) + "px";
             dragT.style.top = parseInt(dragT.style.top) + (e.screenY - oY) + "px";
             oX = e.screenX;
             oY = e.screenY;
             var nowIndex = getIndex(e);
             if (nowIndex != dragIndex)
                 changeDrag(nowIndex);
         }

         function dragUp(e) {
             if (!dragT) return;
             document.onmousemove = null;
             setOpacity(dragT, 1);
             dragT.style.top = 0;
             dragT.style.left = 0;
             ctrls[dragIndex].style.cursor = "";
             dragT = null;
             if (exchaged) {
                 saveDesktopState("您的桌面状态已保存！");
                 exchaged = false;
             }
         }

         function setOpacity(targetE, opacity) {
             /// <summary>设置元素的透明度</summary>
             if (Sys.Browser.name.indexOf("Internet Explorer") != -1)
                 targetE.style.filter = "alpha(opacity=" + parseInt(opacity * 100) + ")";
             else
                 targetE.style.opacity = opacity;
         }

         /* 实现结束 */

         function saveDesktopState(tipMessage) {
             /// <summary>保存桌面当前状态</summary>
             DeskFunService.SetCards(rebuildControls().toString(), function () { showTip(tipMessage); }, function (err) { showTip("对不起，操作失败！原因：" + err.get_message()); });
         }

         function delCard(cardNode) {
             /// <summary>删除一个卡片</summary>
             cardNode.parentNode.removeChild(cardNode);
             saveDesktopState("删除桌面模块成功！");
         }

         function showTip(text) {
             /// <summary>显示桌面提示信息</summary>
             var targetE = $get("tip");
             targetE.innerText = text;
             setFadeAnimation(targetE);
         }

         function setFadeAnimation(targetElement) {
             /// <summary>对元素设置淡入淡出动画</summary>
             var opacity = 0;
             var flag = false;
             targetElement.style.display = "";
             setTimeout(delegate);

             function delegate() {
                 if (opacity < 1 && !flag) {
                     opacity += 0.02;
                     setOpacity(targetElement, opacity);
                     setTimeout(delegate, 20);
                 }
                 else if (!flag) {
                     flag = true;
                     setTimeout(delegate, 500);
                 }
                 else if (opacity > 0 && flag) {
                     opacity -= 0.02;
                     setOpacity(targetElement, opacity);
                     setTimeout(delegate, 20);
                 }
                 else//动画结束
                 {
                     targetElement.style.display = "none";
                 }
             }
         }

    </script>
</asp:Content>
